<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="viewport-fit=cover,width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../../css/mui.picker.min.css" />
		<link rel="stylesheet" href="../../../css/mui.poppicker.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/reset.css" />
		<link rel="stylesheet" type="text/css" href="../../../css/style.css" />
		<style type="text/css">
			/*.mui-poppicker{ background: #fff; }
			.mui-poppicker-body{ height: 300px; border-top: 1px solid #eee;}*/
		</style>
	</head>

	<body class="bgLight">
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">确认订单</h1>
		</header>
		<div v-cloak id="order_detail">
			<div class="mui-content bgLight" >
			<div class="mallOrder" >
				<div class="mallInfo1">
					<div class="info1_img">
						<img :src="image" />
					</div>
					<div class="info1_txt">
						<h4 class="ellipsis2">{{title}}</h4>
						<div class="ggNum">
							<span>{{tab_sku}}</span>
							<span class="proNum">x{{buy_num}}</span>
						</div>
					</div>
				</div>
				<div class="mallOther">
					<div class="mallInfo2">
						<span>产品总价</span>
						<span class="red proAllPrice">{{productPrice}}元</span>
					</div>
					<div class="mallInfo2">
						<span>运费</span>
						<span class="freightPrice red">{{shipping_price}}元</span>
					</div>
					<div class="addAddress db" @tap="addAddress">
						<span v-if="address == null"><em class="iconAdd"><a class="mui-icon mui-icon-new"></a></em>点击添加收货地址</span>
						<span v-else>
							<div class="namePhone">
								<em class="iconAdd">
									<a class="mui-icon mui-icon-location"></a><a class="showName">{{nickname}}</a>
								</em>
								<span class="showTel">{{mobilenum}}</span>
							</div>
							<p class="showAddr">{{address}}</p>
						</span>
						<span v-if="address == null" class="courseArrow"><img src="../../../images/arr_right.png"/></span>
					</div>
				</div>	
			</div>
		</div>
		
		<!--底部固定层-->
		<div class="fix_mall_btn">
			<div class="mall_price_btn">
				<span>总计<em>{{totalPrice}}元</em></span>
				<a class="subBtn" @tap="subBtn">确认支付</a>
			</div>
		</div>
		
		<!--收货地址弹出层-->
		<div class="popMask" @tap="colsePay"></div>
		<div class="popAddress">
			<div class="popCont">
				<div class="pop_tt">
					<span class="colsePay" @tap="colsePay"><img src="../../../images/pay_close.png" alt="" /></span>
					<h4>新增收货地址</h4>
				</div>
				<div class="addrList">
					<ul>
						<li>
							<span>收件人：</span>
							<em><input class="addr_input nameInput" type="text" placeholder="请输入姓名" v-model="nickname" /></em>
						</li>
						<li>
							<span>联系方式：</span>
							<em><input class="addr_input telInput" type="tel" placeholder="请输入手机号" name="" id="" value="" v-model="mobilenum" /></em>
						</li>
						<li>
							<span>所在地区：</span>
							<em id="showAddress" @click="showAddress">请选择地区</em>
						</li>
						<li>
							<span>详细地址：</span>
							<em><input class="addr_input addrInput" type="text" placeholder="请输入详细地址" /></em>
						</li>
					</ul>
				</div>
				<div class="saveBtn" @tap="saveBtn">
					<a>保存并使用</a>
				</div>
			</div>
		</div>

		<!--选择支付方式-->
		<div class="popPay">
			<div class="popCont">
				<div class="pop_tt">
					<span class="colsePay" @tap="colsePay"><img src="../../../images/pay_close.png" alt="" /></span>
					<h4>选择支付方式</h4>
				</div>
				<div class="pay_way">
					<ul class="mui-table-view mui-table-view-radio">
						<li class="mui-table-view-cell  mui-selected" @tap="pay_way('wxpay')">
							<a class="mui-navigate-right"><em class="wx_bg"></em>微信</a>
						</li>
						<li class="mui-table-view-cell" @tap="pay_way('alipay')">
							<a class="mui-navigate-right"><em class="zfb_bg"></em>支付宝</a>
						</li>
					</ul>
				</div>
				<div class="useBtn" @tap="colsePay">
					<a @tap="openPay">确认支付</a>
				</div>
			</div>
		</div>
		
			
		</div>

		
		<script src="../../../js/mui.min.js"></script>
		<script type="text/javascript" src="../../../js/mui.picker.min.js"></script>
		<script type="text/javascript" src="../../../js/mui.poppicker.js"></script>
		<script type="text/javascript" src="../../../js/city.data-3.js"></script>
		<script type="text/javascript" src="../../../js/jquery.min.js"></script>
		<script type="text/javascript" src="../../../js/h.min.js"></script>
		<script type="text/javascript" src="../../../js/tpl/mallOrder.js"></script>
		<script type="text/javascript" src="../../../js/swiper.min.js"></script>
		<script src="../../../js/vue.js"></script>
		<script type="text/javascript" src="../../../js/pay.js"></script>
		<script src="../../../js/public.js"></script>
	</body>

</html>